<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <a href="./首页.html">首页</a>

</head>
<body>
<div id="box">
<h1>欢迎来到我的个人简介</h1>
<div id="header">
<ul class="picture">
<div id="div01">
    <a href="./基础信息.html">
    <img src="./image/插画｜水墨猫2_4_凌_来自小红书网页版.jpg" class="img"><br>
    </a>
<h>基础信息</h>
</div>
<div id="div02">
    <a href="./教育经历.html">
    <img src="./image/插画｜水墨猫2_2_凌_来自小红书网页版.jpg" class="img"><br>
    </a>
<h>教育经历</h>
</div>

<div id="div03">
    <a href="./成绩表.html">
    <img src="./image/插画｜水墨猫2_8_凌_来自小红书网页版.jpg" class="img"><br>
    </a>
<h>成绩表</h>
</div>
<div id="div04">
    <a href="./照片墙.html">
    <img src="./image/插画｜水墨猫2_3_凌_来自小红书网页版.jpg" class="img"><br>
    </a>
<h>照片墙</h>
</div></ul></div></div>
<h4>
<a href="https://gitee.com/liu-meixi_0/liu.git">个人代码仓库地址</a> 
</h4>


<style>
    #box {
    width: 1200px;
    height: 600px;
    background-color: #ffffff90;
    margin: auto;
    text-align: center;
    border-radius: 10px;
    margin: 8% 10%;
    }
    body{
    background:url("./image/55.jpg");background-attachment: fixed;
    background-size: cover;
    }

    h{
    font-size: 20px;
    line-height:80px;
    
    }
    h1{
    text-align: center;
    color:rgb(13, 11, 11);
    line-height: 160px;
    }
    div{
    width: 250px;
    height: 250px;
    }
    
    #header{
    width: 1190px;
    
    }
    #div01{
    float: left;
    margin-right: 40px;
    }
    
    
    #div02{
    float: left;
    margin-right: 40px;
    
    }
    #div03{
    float: left;
    margin-right: 40px;
    }
    #div04{
    float: left;
    
    }
    img {
    width: 230px;
    height: 230px;
    border-radius: 50%;
    }

    h4 {
    margin: -14% 40%;
    text-align: center;
    }
    
    .picture :hover{
    transform:scale(1.1);
    }
    
    </style>
</div>

</div>
</div>
</body>
</html>